<!DOCTYPE html>
<!--[if IE 8]>
<html class="no-js ie8"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js"> <!--<![endif]-->

<head>

    <!-- Basics -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>.:: Abe Peng ::.</title>
    <meta name="description" content="Abe Peng, Android / iOS / JAVA /C#">

    <!-- Favicons -->
    <link rel="shortcut icon" href="website/img/favicons/favicon.ico">

    <!-- Mobile -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <!-- CSS -->
    <link rel="stylesheet" href="website/css/normalize.min.css">
    <link rel="stylesheet" href="website/css/main.css">

    <!-- Fonts -->
    <link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Lato:300,400,700'>

</head>
<body>

<div class="wrapper">

    <header>
        <a class="menu-icon jiji">
            <span></span>
        </a>
        <nav class="menu visuallyhidden">
            <ul>
                <li><a href="#home">Home</a></li>
                <li><a href="#about">关于</a></li>
                <li><a href="#work" hidden="hidden">演示功能</a></li>
                <li><a href="#contact">联系方式</a></li>
            </ul>
        </nav>
    </header>

    <section id="home" class="row">
        <div class="overlay">
            <div class="col home-title jiji">
                <h1>Abe Peng</h1>
                <h2>Android /iOS /Java C#</h2>
            </div>
        </div>

        <div class="overlay_android">
            <div class="col home-title jiji">
                <div class="col home-title jiji imgs">
                    <img src="website/img/app_about.png"/>
                    <img src="website/img/app_about_2.png"/>
                    <img src="website/img/app_about_1.png"/>
                </div>
                <h3>积木成林</h3>
                <h3>Android APP</h3>
                <a href="https://gitee.com/abe_peng/JiMuChengLin/raw/master/abe_jmcl.apk"
                   class="but">点击下载</a>
            </div>
        </div>
    </section>

    <section id="about" class="row">
        <div class="page about-content">
            <div class="col about-title">
                <h3
                        data-100="-webkit-transform: translateX(100px); opacity:0;"
                        data-500="-webkit-transform: translateX(0px); opacity:1;"
                >关于 积木成林</h3>
            </div>
            <div class="col empty">&nbsp;</div>
            <div class="col about-description">
                <p
                        data-100="opacity:0;"
                        data-500="opacity:1;"
                >主要作为部分Android模块功能演示用</p>
                <p
                        data-100="opacity:0;"
                        data-500="opacity:1;"
                >内置常用的工具、模块以及各种开发选型库，作为快速开发库</p>
                <p
                        data-100="opacity:0;"
                        data-500="opacity:1;"
                >集成若干主流模块作为参考，方便以后开发及展示效果</p>
                <p
                        data-100="opacity:0;"
                        data-500="opacity:1;"
                ></p>
                <a href="website/resume.html" class="but">具体工作简介</a>
            </div>
        </div>
    </section>

    <section id="services" class="row">
        <div class="services-content page">
            <div class="col services-development"
                 data-600="-webkit-transform: translateY(10px); opacity:0;"
                 data-800="-webkit-transform: translateY(0px); opacity:1;"
            >
                <span class="icon-design"></span>
                <ul>
                    <li>主要工作内容</li>
                    <li>Android</li>
                    <li>iOS</li>
                    <li>手机服务</li>
                </ul>
            </div>
            <div class="col services-development-tool"
                 data-600="-webkit-transform: translateY(50px); opacity:0;"
                 data-800="-webkit-transform: translateY(0px); opacity:1;"
            >
                <span class="icon-computer"></span>
                <ul>
                    <li>熟悉开发工具</li>
                    <li>Android Studio</li>
                    <li>Eclipse</li>
                    <li>Vs</li>
                    <li>Xcode</li>
                    <li>Git / SVN</li>
                </ul>
            </div>
            <div class="col services-language"
                 data-600="-webkit-transform: translateY(50px); opacity:0;"
                 data-800="-webkit-transform: translateY(0px); opacity:1;"
            >
                <span class="icon-computer"></span>
                <ul>
                    <li>项目经验</li>
                    <li>环保移动执法Android端</li>
                    <li>贵阳节能减排Pad端</li>
                    <li>P2P网贷系统移动端</li>
                    <li>御驾车行APP</li>
                    <li>天展智能健身Android端</li>
                </ul>
            </div>
        </div>
    </section>

    <hr>
    <div class="copyrights">Collect from <a href="http://www.cssmoban.com/">网页模板</a></div>

    <section id="work" class="row" hidden="hidden">
        <div class="work-content page">
            <div class="col work-title">
                <h3
                        data-900="-webkit-transform: translateX(-100px); opacity:0;"
                        data-1300="-webkit-transform: translateX(0px); opacity:1;"
                >My latest work</h3>
            </div>
            <div class="col empty">&nbsp;</div>
            <div class="col work-description">
                <p
                        data-900="opacity:0;"
                        data-1300="opacity:1;"
                >A selection of recent projects I've been working on: landing pages, websites, email
                    marketing...</p>
            </div>
            <div class="col empty">&nbsp;</div>
        </div>
        <div class="work-examples page">
            <div class="col work-item"
                 data-1300="opacity:0;"
                 data-1400="opacity:1;"
            >
                <img src="website/img/works/1.jpg" alt="">
                <div class="work-item-inside">
                    <div class="work-item-inside-content">
                        <h4>Design</h4>
                        <a href="#" class="but">Click here</a>
                    </div>
                </div>
            </div>
            <div class="col work-item"
                 data-1300="opacity:0;"
                 data-1400="opacity:1;"
            >
                <img src="website/img/works/1.jpg" alt="">
                <div class="work-item-inside">
                    <div class="work-item-inside-content">
                        <h4>Design</h4>
                        <a href="#" class="but">Click here</a>
                    </div>
                </div>
            </div>
            <div class="col work-item"
                 data-1300="opacity:0;"
                 data-1600="opacity:1;"
            >
                <img src="website/img/works/1.jpg" alt="">
                <div class="work-item-inside">
                    <div class="work-item-inside-content">
                        <h4>Design</h4>
                        <a href="#" class="but">Click here</a>
                    </div>
                </div>
            </div>
            <div class="col work-item"
                 data-1300="opacity:0;"
                 data-1400="opacity:1;"
            >
                <img src="website/img/works/1.jpg" alt="">
                <div class="work-item-inside">
                    <div class="work-item-inside-content">
                        <h4>Design</h4>
                        <a href="#" class="but">Click here</a>
                    </div>
                </div>
            </div>
            <div class="col work-item"
                 data-1300="opacity:0;"
                 data-1500="opacity:1;"
            >
                <img src="website/img/works/1.jpg" alt="">
                <div class="work-item-inside">
                    <div class="work-item-inside-content">
                        <h4>Design</h4>
                        <a href="#" class="but">Click here</a>
                    </div>
                </div>
            </div>
            <div class="col work-item"
                 data-1300="opacity:0;"
                 data-1600="opacity:1;"
            >
                <img src="website/img/works/1.jpg" alt="">
                <div class="work-item-inside">
                    <div class="work-item-inside-content">
                        <h4>Design</h4>
                        <a href="#" class="but">Click here</a>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <hr>

    <section id="contact" class="row">
        <div class="contact-content page">
            <div class="col contact-title">
                <h3
                        data-100="-webkit-transform: translateX(100px); opacity:0;"
                        data-500="-webkit-transform: translateX(0px); opacity:1;"
                >联系</h3>
            </div>
            <div class="col empty">&nbsp;</div>
            <div class="col contact-description">
                <a href="" class="but">15550012633@163.com</a>
            </div>
            <div class="col empty">&nbsp;</div>
            <div class="col span_12 social">
                <a class="icon-gitee" href="https://gitee.com/abe_peng" target="_blank">
                    <img src="website/fonts/logo_gitee.png"/>
                </a>
                <a class="icon-sina" href="https://weibo.com/u/5726670029" target="_blank">
                    <img src="website/fonts/logo_sina.png"/>
                </a>
                <a class="icon-wechat" href="website/qrcode.html?codetype=wechat" target="_blank">
                    <img src="website/fonts/logo_wechat.png"/>
                </a>
                <a class="icon-qq" href="website/qrcode.html?codetype=qq" target="_blank">
                    <img src="website/fonts/logo_qq.png"/>
                </a>
            </div>
        </div>
    </section>

    <footer id="footer" class="row">
        <div class="footer-content page">
            <div class="col f1">
                <p>© 2017 更多模版 <a href="http://www.cssmoban.com/" target="_blank"
                                  title="模板之家">模板之家</a></p>
            </div>
        </div>
    </footer>

</div>

<div class="loader"></div>

<!-- JavaScript -->
<script src="website/js/jquery-1.11.0.min.js"></script>
<script src="website/js/modernizr-2.6.2.min.js"></script>
<script src="website/js/skrollr.js"></script>
<script src="website/js/main.js"></script>

</body>

</html>